<template>
<h1>登录页面</h1>
  <input type="text" placeholder="用户名" v-model="user.username">
  <input type="password" placeholder="密码" v-model="user.password">
  <input type="button" value="登录" @click="login()">
</template>

<script setup>
 import {ref} from "vue";
 import axios from "axios";
 import router from "@/router";

 const user = ref({username:"",password:""});
 const login = ()=>{
   //发出登录请求
    axios.post('http://localhost:8080/v1/users/login',user.value)
        .then((response)=>{
          if (response.data.code==1){
            //response.data=JsonResult对象  response.data.data是UserVO
            alert("登录成功!欢迎"+response.data.data.nickname+"回来!");
            //把需要多个页面共享的数据放在localStorage对象中
            //localStorage里面只能保存字符串类型的数据,不能保存对象
            //JSON.stringify(对象) 把对象转成JSON格式的字符串
            localStorage.user = JSON.stringify(response.data.data);

            router.push('/');
          }else{
            alert(response.data.msg);
          }
        });
 }
</script>

<style scoped>

</style>